<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>04-ajax-get</title>
		<!--
		 1.什么是ajax？
		 AJAX是与服务器交换数据并更新部分网页的艺术，在不重新加载整个页面的情况下。
		 
		 -->
		 <script type="text/javascript">
			window.onload = function(ev)
			{
				var oBtn = document.querySelector("button");
				oBtn.onclick = function(ev1)
				{
					//1.创建一个异步对象
					var xmlhttp = new XMLHttpRequest();
					//2.设置请求方式和请求地址
					/*
					2.1、method:请求的类型；GET或POST
					2.2、url:文件在服务器上的位置
					2.3、async:true(异步)或者false(同步);
					*/
					xmlhttp.open("GET","04-ajax-get.php",true)
					//3.发送请求
					xmlhttp.send();
					//4.监听状态的变化
					xmlhttp.onreadystatechange = function(ev2)
					{
						/*
						readyState状态信息（0-4共5个）
						 0：请求未初始化
						 1：服务器已经建立
						 2：请求已接收
						 3：请求处理中
						 4：请求已完成，切响应已就绪
						*/
						if(xmlhttp.readyState === 4)
						{
							//判断是否请求成功
							if(xmlhttp.status >= 200 && xmlhttp.status < 300 || xmlhttp.status === 304)
							{
								//5.处理返回的结果
								console.log("接收到服务器返回的数据");
							}else
							{
								console.log("没有接收到服务器返回的数据");
							}
					
						};
						
					};
					//5.处理返回的结果
				};
				
			};
		 </script>
	</head>
	<body>
	<button>发送请求</button>
	</body>
</html>
